Choose display style and mode:
The component below remains the same, it just receives new props:
Content Be Here
Unless we have nothing.
More Content Be Here
But we have something.
Choose display style and mode:
The component below remains the same, it just receives new props:
Unless we have nothing.
But we have something.
You do the styles. Or you rip these demo styles and customize.
Tabbordion defaults to BEM style classes: panel, panel__state, panel__title, panel__content, panel__animator… and does the hard work of adding enough modifiers to make styling easy!
As you can see by looking at demo app.js or CSS files these are customizable and even removable.
If you want to read about Tabbordion's class naming logic more there is Advanced BEM with React components article over at CodePen.
This demo uses Font Awesome in Accordion styles and Normalize.css to unite rendering across browsers. Because default styles are not enforced you don't need to rip these away if you don't happen to like or otherwise need them.